import Taro, { useState, useEffect, useRouter, useMemo } from '@tarojs/taro'
import { View } from '@tarojs/components'
import m from 'moment'

// components
import ReportAnalysis from "../../components/reportAnalysis";
import ReportTable from "../../components/reportTable";

// constances
import { REPORT_TYPE_MAP } from '../../constances/constances'

// util
import getLoginInfo from "../../utils/getLoginInfo";
import sumReportData from "../../utils/sumReportData";

// api
import api from '../../api/index'

// style
import './index.scss'
import getFormatSeconds from "../../utils/getFormatSeconds";

export default function Report() {
  const [reportList, setReportList] = useState([])
  const [loading, setLoading] = useState(false)
  const router = useRouter()
  const reportType = router.params.type

  useEffect(async () => {
    getLoginInfo()
    if (router.params.timeStamp) {
      if (reportType === '1') {
        // 日报
        Taro.setNavigationBarTitle({
          title: m(parseInt(router.params.timeStamp)).format('YYYY-MM-DD')
        })
      }

      if (reportType === '2') {
        Taro.setNavigationBarTitle({
          title: m(parseInt(router.params.timeStamp)).format('YYYY-MM')
        })
      }

      const durationMap = {
        1: 'day',
        2: 'month'
      }

      const duration = durationMap[reportType]

      const start = m(parseInt(router.params.timeStamp)).startOf(duration).valueOf()
      const end = m(parseInt(router.params.timeStamp)).endOf(duration).valueOf()
      setLoading(true)
      const data = await api.score.getScoreDetail({
        start,
        end
      })
      setLoading(false)
      if (data.code > 0) {
        setReportList(JSON.parse(data.data).userScoreLogList)
      }
    }

  }, [router])

  const reportAnalysisData = useMemo(() => {
    return sumReportData(reportList)

  }, [reportList])


  const rows = [{
    value: reportAnalysisData.readBookCount,
    label: reportType === '1' ? '本日阅读' : '累计阅读'
  }, {
    value: reportAnalysisData.wordCount,
    label: reportType === '1' ? '本日单词' : '累计单词'
  }, {
    value: ( reportType === '1' ? (reportAnalysisData.studySeconds / (60)).toFixed(1) : (reportAnalysisData.studySeconds / (60 *60)).toFixed(1)),
    label: reportType === '1' ? '本日时长(分)' : '累计时长(时)'
  }, {
    value: reportAnalysisData.recordingShareCount,
    label: '录音分享'
  }];

  const monthTableRows = [{
    title: '日期',
    render: report => m(report.timeStamp).format('YYYY-MM-DD')
  }, {
    title: '阅读',
    // render: report => report.readBookCount
    render: report => report.readBookCount
  }, {
    title: '单词',
    render: report => report.wordCount
  }, {
    title: '录音分享',
    render: report => report.recordingShareCount
  }, {
    title: '学习时长',
    render: report => getFormatSeconds(report.studySeconds)
  },  {
    title: '',
    more: {
      onClick: (report) => {
        Taro.navigateTo({
          url: `/pages/report/index?timeStamp=${report.timeStamp}&type=1`
        })
      }
    }
  }]

  const dailyTableRows = [{
    title: '学习时长',
    render: report => getFormatSeconds(report.studySeconds)
  }, {
    title: '单词',
    render: report => report.wordCount
  }, {
    title: '类型',
    render: report => REPORT_TYPE_MAP[report.type]
  }, {
    title: '书籍',
    maxWidth: '300rpx',
    render: report => {
      const detail = report.detailJson && JSON.parse(report.detailJson) || {}
      return detail.bookName ? `《${detail.bookName}》` : ''
    }
  }]

  const currentTableRows = {
    1: dailyTableRows,
    2: monthTableRows,
  }

  const tableRows = currentTableRows[reportType]


  console.log('router.params.type',router.params.type)

  return (
    <View className='report-detail-page'>

      <ReportAnalysis rows={rows} />

      <ReportTable
        dataSource={reportList}
        rows={tableRows}
        loading={loading}
        reportType={parseInt(router.params.type, 10)}
      />
    </View>
  )
}

Report.config = {
  navigationBarTitleText: '阅读记录',
}
